<template>
  <div>
    <!-- <h3>当前最新的count值为：{{count}}</h3> -->
    <h3>{{showNum}}</h3>
    <button @click="sub">-1</button>
    <button @click="subN(3)">-N</button>
    <button @click="subAsync">-1 Async</button>
    <button @click="subAsyncN(3)">-N Async</button>
  </div>
</template>

<script>
import { mapState,mapMutations,mapActions,mapGetters } from 'vuex'
export default {
  data(){
    return{}
  },
  computed:{
    ...mapState(['count']),
    ...mapGetters(['showNum'])
  },
  methods:{
    // 将全局的mutations方法映射为自己的methods方法，可以直接在template中使用该方法
    ...mapMutations(['sub', 'subN']),
    // 将全局的actions方法映射为自己的methods方法，可以直接在template中使用该方法
    ...mapActions(['subAsync','subAsyncN']),
  }
}
</script>